<script >
import {listAll} from "@/api/kong/group";
import {goLive} from "@/api/kong/kong";
const nowOneTime = new Date();
nowOneTime.setTime(nowOneTime.getTime() + 3600 * 1000);
export default {
  data() {
    return {
      sumbmitLoading:false,
      checkAll: false,
      checkedCities: [],
      isIndeterminate: false,
      groupList:[],
      formData:{
        groupNames:[],
        params: {
          yhms:1,
          endTime:nowOneTime,
          randmonStopTime:60,
          likeRate:50,
          flowTypes:[],
          keyword: ''
        },
        cmdSetGid:11,
        actype:1
      },
      actypes:[{name:'关注',value:1},{name:'关注福袋主播',value:2},{name:'关注红包主播',value:3}],
      pickerOptions: {
        shortcuts: [{
          text: '1小时后',
          onClick(picker) {
            const date = new Date();
            date.setTime(date.getTime() + 3600 * 1000);
            picker.$emit('pick', date);
          }
        }, {
          text: '1天后',
          onClick(picker) {
            const date = new Date();
            date.setTime(date.getTime() + 3600 * 1000 * 24);
            picker.$emit('pick', date);
          }
        }, {
          text: '2天后',
          onClick(picker) {
            const date = new Date();
            date.setTime(date.getTime() + 3600 * 1000 * 24 * 2);
            picker.$emit('pick', date);
          }
        }]
      },
    };
  },
  created() {
    this.groups();
  },
  methods: {
    handleCheckAllChange(val) {
      this.formData.groups = val ? this.groupList.map(item => item.groupName) : [];
      this.isIndeterminate = false;
    },
    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.groupList.length;
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.groupList.length;
    },
    likeAndFllows(value){

    },
    groups(keyword){
      this.loadinggroups = true
      const queryParams = {keyword:keyword};
      listAll(queryParams).then(response => {
        this.groupList = response.data;
      }).finally(() =>{
        this.loadinggroups = false
      });
    },
    onSubmit(actype){
      if(this.formData.groupNames.length===0){
        this.$modal.msgError("请选择要执行的组");
        return;
      }
      if(this.formData.params.keyword===''){
        this.$modal.msgError("请输入养号标签关键字内容.");
        return;
      }
      this.sumbmitLoading = true;
      this.formData.actype = actype ;//命令方式
      goLive(this.formData).then(response => {
        this.$modal.msgSuccess("命令发送成功");
      }).finally(() =>{
        this.sumbmitLoading = false
      });
    }
  }
};
</script>

<template>
  <div class="setcmd">
    <el-form ref="form" model="formData" label-width="120px">
      <el-form-item label="选择执行组" required>
        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
        <el-checkbox-group v-model="formData.groupNames" @change="handleCheckedCitiesChange">
          <el-checkbox v-for="city in groupList" :label="city.groupName" :key="city.gid" :value="city.groupName">{{city.groupName}}({{city.totalNum}})</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-divider content-position="left">抖音养号参数设置</el-divider>
      <el-form-item label="养号模式" required>
        <el-radio v-model="formData.params.yhms" :label="1">推荐里养</el-radio>
        <el-radio v-model="formData.params.yhms" :label="2">直播间养</el-radio>
      </el-form-item>
      <el-form-item label="养号截止时间" required>
        <el-row :gutter="9">
          <el-col :span="4">
            <el-date-picker
              v-model="formData.params.endTime"
              type="datetime"
              placeholder="选择日期时间"
              format="yyyy-MM-dd HH:mm:ss"
              align="right"
              :picker-options="pickerOptions">
            </el-date-picker>
          </el-col>
          <el-col :span="7">选择的时间是截止时间</el-col>
        </el-row>
      </el-form-item>

      <el-form-item label="随机停留" required>
        <el-row :gutter="9">
          <el-col :span="2">
            <el-input  placeholder="输入时长" v-model="formData.params.randmonStopTime"></el-input>
          </el-col>
          <el-col :span="7">秒左右(会在所填时间加减5秒范围内随机)</el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="随机点赞" required>
        <el-row :gutter="9">
          <el-col :span="2">
            <el-input  placeholder="输入时长" v-model="formData.params.likeRate"></el-input>
          </el-col>
          <el-col :span="7">%(注意是百分比,频率)</el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="是否关注" required>
        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
        <div style="margin: 15px 0;"></div>
        <el-checkbox-group v-model="formData.params.flowTypes" @change="handleCheckedCitiesChange">
          <el-checkbox v-for="city in actypes" :label="city.value" :key="city.value">{{city.name}}</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="自定义内容关键字" required>
        <el-input
          type="textarea"
          placeholder="规则:如 鱼竿|唱歌|户外"
          v-model="formData.params.keyword">
        </el-input>
        自定义互动(自定义需要在上框填入内容,多句用|分割(随机))
      </el-form-item>
<!--      <el-form-item label="直播间人数小于" required>-->
<!--        <el-row :gutter="9">-->
<!--          <el-col :span="2">-->
<!--            <el-input  placeholder="输入时长" v-model="formData.searchContent"></el-input>-->
<!--          </el-col>-->
<!--          <el-col :span="7">人(0为不限直播间人数)</el-col>-->
<!--        </el-row>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="定时切号" required>-->
<!--        <el-row :gutter="9">-->
<!--          <el-col :span="2">-->
<!--            <el-input  placeholder="输入时长" v-model="formData.searchContent"></el-input>-->
<!--          </el-col>-->
<!--          <el-col :span="7">分钟(0为不开启定时切号功能)</el-col>-->
<!--        </el-row>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="切号前休息" required>-->
<!--        <el-row :gutter="9">-->
<!--          <el-col :span="2">-->
<!--            <el-input  placeholder="输入时长" v-model="formData.searchContent"></el-input>-->
<!--          </el-col>-->
<!--          <el-col :span="7">分钟(0为切号前不休息)</el-col>-->
<!--        </el-row>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="低电量模式" required>-->
<!--        <el-row :gutter="9">-->
<!--          <el-col :span="2">-->
<!--            <el-input  placeholder="输入时长" v-model="formData.searchContent"></el-input>-->
<!--          </el-col>-->
<!--          <el-col :span="7">%(0为不开启,当电量低于此数值,则暂停任务,当达到此电量继续工作)</el-col>-->
<!--        </el-row>-->
<!--      </el-form-item>-->
      <el-form-item>
        <el-button type="primary" @click="onSubmit(1)" :loading="sumbmitLoading">立即执行</el-button>
        <el-button type="danger" @click="onSubmit(-2)" :loading="sumbmitLoading">停止任务</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<style scoped lang="scss">
.setcmd{
  margin: 10px;
}
</style>
